I can't figure out what's wrong with this because no matter what I do the the button inside the tabbed area it shows up next to the TC items rather than below. (I know there's probably more wrong with it as a whole, but this is what I'm stuck on atm)

The code I've been using (sorry if it's a little weird, this is what it was when I first noticed the problem since nothing after that fixed it):

SPOILER (click to toggle)

CSS: {position: fixed; height:94px; width:512px; top:410px; left:560px; overflow:hidden; padding: 2px; margin-left: auto; margin-right: auto;} , {height:94px; width:512px; top:410px; left:560px; overflow: auto; padding: 2px; background-color: ; margin-left: auto; margin-right: auto;}

.brownbox img, .brownbox2 img {bottom: 0px; background-color: ; margin-left: auto; margin-right: auto;}

And the HTML:

Pile of Experiment Plushies

Pile of Experiment Plushies

Pile of Experiment Plushies

Pile of Experiment Plushies

Pile of Experiment Plushies

Pile of Experiment Plushies

Pile of Experiment Plushies

Pile of Experiment Plushies

Plushie"/>
Experiment Plushie

Any help would be very appreciated! C:

For me it looks like this. So I think the button (assuming you mean the brown field with the arrows) looks fine to me in Chrome and Firefox.

It shows up underneath the piles of experiments but what I mean is when you click on it :/ It should come up with the 911 experiment plushie and the button to the right of the plushie instead of underneath. Thanks for the screenshot btw! I didn't realise it was that badly positioned XD What screen resolution/browser were you using during that screenshot?

You mean you want it like this (because that what it does for me) or is that not what you want? I'm using Chrome and my resolution is 1920x1080 but it looks like that in firefox, too.

I want the arrow box below the plushie like it looks with the piles of experiments (although for both of them I want it centered below the items)! I think it must be the resolution that's made my positioning off then since mine is 1366x768. I'll work on that part later though XD

When I look at the code I've found that you open so many divs that it gets really easy to lose track of everything. The buttons are part of the treasure divs, that why it doesn't change the line unless there is not enough space left.

I removed most of the unnecessary things in your code but it could be simplified even more and get rid of a lot of divs. (I can do that, too, if you'd like)

Thank you! It's working better now! Although it turns up within the description area now for some reason? :o

[edit] I think I fixed it now? XD I changed the 'absolute' to 'fixed' in the pettreasfull css. Thank you so much for the help with the button! <3 Do you mind if I credit your help once I add the credits?

I'm not a fan of a fixed positioning unless you really want it fixed upon scrolling because it will be messed up for small screens otherwise. That's why I would suggest to change the left and top values so it matches again.^^

Oh, I didn't even think of that :o And lol, I should not be trying to work with code at 1am. Um so you mean add the top+left values to the pettreas1 and 2 brackets? Like this: {position: absolute; height:94px; width:512px; top:410px; left:560px; overflow:hidden;} , {height:94px; width:512px; top:410px; left:560px;}? It doesn't seem to be working :o I feel like I'm misunderstanding though. Sorry for all the trouble! I'm so bad at this XD

No, don't add them to the two inner divs! I meant you should change the left and top values of the div so it's positioned correctly^^ But now that I see it: You should put the description in a div, too. Because if you use as a div then every div you add manually will go inside the pet description box.

I've changed both! It's definitely working now! :D Thank you again!

That's good to hear^^